<template>
	<view :class="[primarySize()]">
		<!-- #ifdef H5 || APP-PLUS -->
		<view class="container">
			<image class="m-backdrop" src="https://admin.mosizp.cn/static/public/Back.png" mode="widthFix"></image>
			<view class="pr login-wrap">
				<view class="title">登录</view>

				<!-- 身份选择 -->
				<view class="identity-selector mb40">
					<view class="identity-item" :class="{active: selectedGroupId==1}" @click="selectIdentity(1)">
						<image src="https://admin.mosizp.cn/static/public/switch1.png" mode="aspectFill" class="identity-icon"></image>
						<view class="identity-text">人才</view>
						<view class="identity-desc">我要找工作</view>
					</view>
					<view class="identity-item" :class="{active: selectedGroupId==2}" @click="selectIdentity(2)">
						<image src="https://admin.mosizp.cn/static/public/switch2.png" mode="aspectFill" class="identity-icon"></image>
						<view class="identity-text">用人单位</view>
						<view class="identity-desc">我要招人才</view>
					</view>
				</view>

				<view class="login-box mb40">
					<view class="input-box flex-box">
						<image class="mr30" src="https://admin.mosizp.cn/static/public/icon_phone.png" mode="aspectFill"></image>
						<input class="flex-grow-1 fs28" v-model="mobile" placeholder="请输入手机号" />
						<view class="col-red fs28 ptb10" @click="getCode()">{{codeText}}</view>
					</view>
					<view class="input-box flex-box">
						<image class="mr30" src="https://admin.mosizp.cn/static/public/icon_code.png" mode="aspectFill"></image>
						<input class="flex-grow-1 fs28" v-model="code" placeholder="请输入验证码" />
					</view>
					<view class="btn-login" @click="mobilelogin()">登 录</view>
					<view class="fs26 col-6 tc">未注册用户，登录即创建账户</view>
				</view>
				<view class="foot-row flex-box flex-center fs26 col-6">
					<image @click="toggleAgree" :src="iconPath(isAgree?'choose_sc.png':'choose_uc.png')"
						mode="aspectFill"></image>
					<view>我已阅读并同意</view>
					<!-- "agreement('user_agreement')" -->
					<!-- <view class="col-red" @click="agreePopOpen('user_agreement')">《用户协议》</view>
					<view>和</view> -->
					<view class="col-red" @click="agreePopOpen('privacy_agreement')">《隐私政策》</view>
				</view>
			</view>
		</view>
		<!-- #endif -->

		<!-- #ifdef MP-WEIXIN -->
		<view class="container">
			<view class="authorize_content">
				<button class="header" hover-class="none" open-type="chooseAvatar" @chooseavatar="onChooseAvatar">
					<image :src="avatar?avatar:'https://admin.mosizp.cn/static/public/avatar.png'" mode="aspectFill" class="head"></image>
					<view class="tips flex-box flex-col flex-center">
						<view>上传</view>
						<view>头像</view>
					</view>
				</button>
				<!-- <view class="title">请确认以下授权信息</view> -->
				<view class="input-box flex-box mt50">
					<image class="mr30" :src="iconPath('choose_uc.png')" mode="widthFix"></image>
					<view class="fs28">用户昵称</view>
					<input class="flex-grow-1 pl30 tr fs28" type="nickname" @nicknamereview="onNickname"
						v-model="nickname" placeholder="请输入昵称" />

				</view>
				<view class="info">·获取您的信息(手机号等)</view>
				<button hover-class="none" v-if="avatar && nickname" open-type="getPhoneNumber" class="btn1"
					@getphonenumber="getPhoneNumber" style="background-color: var(--primary);">授权登录</button>
				<button hover-class="none" v-else class="btn1" @click="onAuthTips()"
					style="background-color: var(--primary);">授权登录</button>
				<button hover-class="none" class="btn2" @click="closeLogin">暂不登录</button>
				<view class="user-rules">
					<view class="rules">
						<text>登录即代表同意</text>
						<text class="primary-color" @click="agreePopOpen('privacy_agreement')">《隐私政策》</text>
					</view>
				</view>
			</view>
		</view>
		<!-- #endif -->

		<!-- 隐私政策弹窗 -->
		<view v-if="showAgreePopup" class="popup-mask" @tap.stop="">
			<view class="agreePop" @tap.stop="">
				<view class="popup-header">
					<text class="popup-title">{{popupTitle}}</text>
					<view class="close-btn" @click="agreePopClose">
						<text>×</text>
					</view>
				</view>
				<view class="popup-content">
					<!-- H5端使用iframe -->
					<!-- #ifdef H5 -->
					<iframe :src="webViewUrl" class="iframe-content"></iframe>
					<!-- #endif -->
					<!-- APP端和小程序端使用文本内容 -->
					<!-- #ifndef H5 -->
					<scroll-view scroll-y class="text-content">
						<rich-text :nodes="agreementContent"></rich-text>
					</scroll-view>
					<!-- #endif -->
				</view>
				<view class="foot-wrap flex-box">
					<view class="btn-disagree" @click="handleDisagree">不同意</view>
					<view class="btn-agree" @click="handleAgree">同意</view>
				</view>
			</view>
		</view>

	</view>
</template>

<script>
	const app = getApp();
	export default {
		data() {
			return {

				avatar: '',
				nickname: '',
				mobile: '',
				disabledCode: false,
				codeText: '验证码',
				code: '',
				isAgree: true,
				selectedGroupId: 1, // 默认选择人才身份
				article: {
					name: '',
					content: ''
				},
				popupTitle: '',
				webViewUrl: '',
				showAgreePopup: false,
				agreementContent: '', // 当前显示的协议内容
				// 隐私政策内容
				privacyAgreement: `
					<div style="padding: 30rpx; font-size: 28rpx; line-height: 1.8; color: #333;">
						<h2 style="font-size: 32rpx; font-weight: bold; margin-bottom: 20rpx;">隐私政策</h2>
						<p style="margin-bottom: 20rpx;">欢迎使用我们的服务！我们非常重视您的隐私保护和个人信息安全。</p>

						<h3 style="font-size: 30rpx; font-weight: bold; margin: 30rpx 0 20rpx;">一、信息收集</h3>
						<p style="margin-bottom: 15rpx;">1.1 我们可能收集以下信息：</p>
						<p style="margin-bottom: 10rpx; padding-left: 20rpx;">• 个人身份信息（如姓名、手机号码）</p>
						<p style="margin-bottom: 10rpx; padding-left: 20rpx;">• 账户信息（如用户名、头像、昵称）</p>
						<p style="margin-bottom: 10rpx; padding-left: 20rpx;">• 设备信息（如设备型号、操作系统版本）</p>
						<p style="margin-bottom: 20rpx; padding-left: 20rpx;">• 位置信息（如您授权）</p>

						<h3 style="font-size: 30rpx; font-weight: bold; margin: 30rpx 0 20rpx;">二、信息使用</h3>
						<p style="margin-bottom: 15rpx;">2.1 我们使用收集的信息用于：</p>
						<p style="margin-bottom: 10rpx; padding-left: 20rpx;">• 提供、维护和改进我们的服务</p>
						<p style="margin-bottom: 10rpx; padding-left: 20rpx;">• 处理您的交易和请求</p>
						<p style="margin-bottom: 10rpx; padding-left: 20rpx;">• 向您发送重要通知</p>
						<p style="margin-bottom: 20rpx; padding-left: 20rpx;">• 保护服务安全</p>

						<h3 style="font-size: 30rpx; font-weight: bold; margin: 30rpx 0 20rpx;">三、信息保护</h3>
						<p style="margin-bottom: 15rpx;">3.1 我们采取合理的安全措施保护您的个人信息，包括：</p>
						<p style="margin-bottom: 10rpx; padding-left: 20rpx;">• 数据加密传输和存储</p>
						<p style="margin-bottom: 10rpx; padding-left: 20rpx;">• 严格的访问控制</p>
						<p style="margin-bottom: 20rpx; padding-left: 20rpx;">• 定期安全审查</p>

						<h3 style="font-size: 30rpx; font-weight: bold; margin: 30rpx 0 20rpx;">四、信息共享</h3>
						<p style="margin-bottom: 15rpx;">4.1 除以下情况外，我们不会与第三方共享您的个人信息：</p>
						<p style="margin-bottom: 10rpx; padding-left: 20rpx;">• 获得您的明确同意</p>
						<p style="margin-bottom: 10rpx; padding-left: 20rpx;">• 法律法规要求</p>
						<p style="margin-bottom: 20rpx; padding-left: 20rpx;">• 保护用户或公众的安全</p>

						<h3 style="font-size: 30rpx; font-weight: bold; margin: 30rpx 0 20rpx;">五、您的权利</h3>
						<p style="margin-bottom: 10rpx; padding-left: 20rpx;">• 访问、更正您的个人信息</p>
						<p style="margin-bottom: 10rpx; padding-left: 20rpx;">• 删除您的账户和数据</p>
						<p style="margin-bottom: 10rpx; padding-left: 20rpx;">• 撤回授权同意</p>
						<p style="margin-bottom: 20rpx; padding-left: 20rpx;">• 投诉举报</p>

						<h3 style="font-size: 30rpx; font-weight: bold; margin: 30rpx 0 20rpx;">六、未成年人保护</h3>
						<p style="margin-bottom: 20rpx;">我们不会故意收集未成年人的个人信息。如发现请及时联系我们删除。</p>

						<h3 style="font-size: 30rpx; font-weight: bold; margin: 30rpx 0 20rpx;">七、联系我们</h3>
						<p style="margin-bottom: 10rpx;">如您对本隐私政策有任何疑问，请通过以下方式联系我们：</p>
						<p style="margin-bottom: 10rpx; padding-left: 20rpx;">客服电话：400-XXX-XXXX</p>
						<p style="margin-bottom: 30rpx; padding-left: 20rpx;">邮箱：support@example.com</p>

						<p style="color: #999; font-size: 26rpx;">本隐私政策最后更新于：2024年1月1日</p>
					</div>
				`,
				// 用户协议内容
				userAgreement: `
					<div style="padding: 30rpx; font-size: 28rpx; line-height: 1.8; color: #333;">
						<h2 style="font-size: 32rpx; font-weight: bold; margin-bottom: 20rpx;">用户协议</h2>
						<p style="margin-bottom: 20rpx;">欢迎使用我们的服务！请您仔细阅读以下条款。</p>

						<h3 style="font-size: 30rpx; font-weight: bold; margin: 30rpx 0 20rpx;">一、服务条款的接受</h3>
						<p style="margin-bottom: 20rpx;">1.1 您使用本服务即表示您同意接受本协议的全部条款和条件。</p>

						<h3 style="font-size: 30rpx; font-weight: bold; margin: 30rpx 0 20rpx;">二、账户注册</h3>
						<p style="margin-bottom: 15rpx;">2.1 注册要求：</p>
						<p style="margin-bottom: 10rpx; padding-left: 20rpx;">• 提供真实、准确的个人信息</p>
						<p style="margin-bottom: 10rpx; padding-left: 20rpx;">• 妥善保管账户密码</p>
						<p style="margin-bottom: 20rpx; padding-left: 20rpx;">• 对账户下的行为负责</p>

						<h3 style="font-size: 30rpx; font-weight: bold; margin: 30rpx 0 20rpx;">三、用户行为规范</h3>
						<p style="margin-bottom: 15rpx;">3.1 您承诺不会：</p>
						<p style="margin-bottom: 10rpx; padding-left: 20rpx;">• 发布违法违规信息</p>
						<p style="margin-bottom: 10rpx; padding-left: 20rpx;">• 侵犯他人权益</p>
						<p style="margin-bottom: 10rpx; padding-left: 20rpx;">• 干扰服务正常运行</p>
						<p style="margin-bottom: 20rpx; padding-left: 20rpx;">• 进行商业性垃圾信息传播</p>

						<h3 style="font-size: 30rpx; font-weight: bold; margin: 30rpx 0 20rpx;">四、知识产权</h3>
						<p style="margin-bottom: 20rpx;">4.1 本服务的所有内容（包括但不限于文字、图片、音频、视频、软件等）的知识产权归我们所有。</p>

						<h3 style="font-size: 30rpx; font-weight: bold; margin: 30rpx 0 20rpx;">五、免责声明</h3>
						<p style="margin-bottom: 15rpx;">5.1 在法律允许的范围内，我们不对以下情况承担责任：</p>
						<p style="margin-bottom: 10rpx; padding-left: 20rpx;">• 不可抗力因素导致的服务中断</p>
						<p style="margin-bottom: 10rpx; padding-left: 20rpx;">• 用户自身原因造成的损失</p>
						<p style="margin-bottom: 20rpx; padding-left: 20rpx;">• 第三方行为造成的损害</p>

						<h3 style="font-size: 30rpx; font-weight: bold; margin: 30rpx 0 20rpx;">六、协议变更</h3>
						<p style="margin-bottom: 20rpx;">6.1 我们有权随时修改本协议，修改后的协议将在平台上公布。继续使用服务即视为接受修改后的协议。</p>

						<h3 style="font-size: 30rpx; font-weight: bold; margin: 30rpx 0 20rpx;">七、法律适用</h3>
						<p style="margin-bottom: 20rpx;">7.1 本协议适用中华人民共和国法律。</p>

						<p style="color: #999; font-size: 26rpx;">本协议最后更新于：2024年1月1日</p>
					</div>
				`
			}
		},
		onReady() {
			uni.setNavigationBarColor({
				frontColor: '#ffffff',
				backgroundColor: this.primaryColor()
			})
		},
		onLoad() {
			// 检查是否首次进入，显示隐私政策
			this.checkPrivacyAgreement();

			let page = this;
			//#ifdef MP-WEIXIN
			this.$core.wxLogin(function(data) {
				getApp().globalData.userinfo = data;
				uni.$emit(app.globalData.Events.UserLogin,data);
				uni.showToast({
					title: '登录成功',
				});
				// 登录成功后统一使用reLaunch跳转到首页
				uni.reLaunch({
					url: '/pages/public/index'
				});
			});
			// #endif
		},
		// 阻止返回操作（Android物理返回键）
		onBackPress(options) {
			// 返回true表示阻止默认的返回行为
			return true;
		},
		methods: {
			// 选择身份
			selectIdentity(groupId) {
				this.selectedGroupId = groupId;
			},
			// 检查是否首次进入，自动显示隐私政策
			checkPrivacyAgreement() {
				// 小程序端不需要首次弹窗
				// #ifdef MP-WEIXIN
				return;
				// #endif

				// 检查本地存储中是否已同意隐私政策
				const hasAgreed = uni.getStorageSync('privacy_agreed');
				if (!hasAgreed) {
					// 首次进入，自动弹出隐私政策
					this.agreePopOpen('privacy_agreement');
				}
			},
			// 用户同意隐私政策
			handleAgree() {
				// 保存同意状态
				uni.setStorageSync('privacy_agreed', true);
				// 关闭弹窗
				this.agreePopClose();
			},
			// 用户不同意隐私政策
			handleDisagree() {
				uni.showModal({
					title: '提示',
					content: '不同意隐私政策将无法使用本应用，是否确定退出？',
					confirmText: '退出',
					cancelText: '重新阅读',
					success: (res) => {
						if (res.confirm) {
							// 用户确认退出
							// #ifdef APP-PLUS
							plus.runtime.quit();
							// #endif
							// #ifdef H5
							window.history.back();
							// #endif
							// #ifdef MP-WEIXIN
							// 小程序无法直接退出，返回上一页或提示
							uni.showToast({
								title: '请关闭小程序',
								icon: 'none',
								duration: 2000
							});
							// #endif
						} else {
							// 用户选择重新阅读，不关闭弹窗
						}
					}
				});
			},
			onChooseAvatar(e) {
				var that = this
				//#ifdef MP-WEIXIN
				that.$core.uploadFile({
					filePath: e.detail.avatarUrl,
					success: (ret, response) => {
						that.avatar = ret.data.url;
					}
				});
				//#endif
			},
			onNickname(e) {
				if (!e.detail.pass) {
					uni.showToast({
						title: '昵称不合法',
						icon: 'none'
					})
					this.nickname = '';
				}
			},
			closeLogin() {
				uni.navigateBack({
					delta: 1
				})
			},
			agreePopOpen(type) {
				// 设置弹窗标题
				if (type === 'privacy_agreement') {
					this.popupTitle = '隐私政策';
					this.webViewUrl = 'https://admin.mosizp.cn/service.html';

					// 从URL获取HTML内容
					uni.showLoading({
						title: '加载中...',
						mask: true
					});

					uni.request({
						url: this.webViewUrl,
						method: 'GET',
						success: (res) => {
							uni.hideLoading();
							if (res.statusCode === 200 && res.data) {
								// 提取HTML内容
								let htmlContent = res.data;

								// 如果是字符串，尝试提取body内容
								if (typeof htmlContent === 'string') {
									// 提取body标签内的内容
									let bodyMatch = htmlContent.match(/<body[^>]*>([\s\S]*)<\/body>/i);
									if (bodyMatch && bodyMatch[1]) {
										htmlContent = bodyMatch[1];
									}

									// 移除script标签
									htmlContent = htmlContent.replace(/<script\b[^<]*(?:(?!<\/script>)<[^<]*)*<\/script>/gi, '');
								}

								// 设置内容
								this.agreementContent = htmlContent;
							} else {
								// 如果获取失败，使用默认内容
								this.agreementContent = this.privacyAgreement;
							}
							// 显示弹窗
							this.showAgreePopup = true;
						},
						fail: (err) => {
							console.log('获取隐私政策失败:', err);
							uni.hideLoading();
							// 获取失败时使用默认内容
							this.agreementContent = this.privacyAgreement;
							this.showAgreePopup = true;
						}
					});
				} else if (type === 'user_agreement') {
					this.popupTitle = '用户协议';
					this.webViewUrl = 'https://admin.mosizp.cn/user_agreement.html';
					this.agreementContent = this.userAgreement;
					this.showAgreePopup = true;
				}
			},
			agreePopClose() {
				this.showAgreePopup = false;
			},
			toggleAgree() {
				this.isAgree = !this.isAgree;
			},

			//获取验证码
			getCode() {
				if (this.disabledCode) return false;
				let mobile = this.mobile;
				if (!mobile) {
					uni.showToast({
						title: '手机号不得为空',
						icon: 'none'
					})
					return false
				}
				this.$core.post({
					url: 'sms/send',
					data: {
						mobile: mobile,
						event: 'mobilelogin'
					},
					success: (ret) => {
						this.timeCut();
					}
				});
			},
			// 倒计时
			timeCut() {
				if (this.disabledCode) return;
				this.disabledCode = true;
				let n = 60;
				this.codeText = n + 's';
				const run = setInterval(() => {
					n -= 1;
					if (n < 0) {
						clearInterval(run);
					}
					this.codeText = n + 's';
					if (this.codeText < 0 + 's') {
						this.disabledCode = false;
						this.codeText = '验证码';
					}
				}, 1000);
			},
			onAuthTips() {
				uni.showToast({
					title: '请先完善昵称头像',
					icon: 'none'
				})
			},
			mobilelogin() {
				let that = this;
				if (!that.isAgree) {
					uni.showToast({
						title: '请同意协议',
						icon: 'none'
					})
					return false
				}
				let mobile = this.mobile;
				let code = this.code;
				if (!mobile || !code) {
					uni.showToast({
						title: '手机号/验证码必填',
						icon: 'none'
					})
					return false
				}
				let recom_pid = uni.getStorageSync('recom_pid') || '';
				this.$core.post({
					url: 'xilujob.user/mobilelogin',
					data: {
						mobile: mobile,
						captcha: code,
						first_group_id: this.selectedGroupId
					},
					success: (ret) => {
						console.log('登录成功返回数据：', ret);
						let userinfo = ret.data.userinfo;
						that.$core.setUserinfo(userinfo);
						uni.$emit("user_update", {});
						uni.$emit(getApp().globalData.Events.UserLogin, userinfo);
						uni.showToast({
							title: '登录成功',
							icon: 'success'
						});
						setTimeout(() => {
							// 检查用户头像和昵称是否为空
							if (!userinfo.avatar || !userinfo.nickname) {
								// 跳转到用户信息验证页面
								uni.navigateTo({
									url: '/pages/company/mine_info'
								});
								return;
							}
							// 登录成功后统一使用reLaunch跳转到首页
							uni.reLaunch({
								url: '/pages/public/index'
							});
						}, 500);
					},
					fail: (err) => {
						console.log('登录失败：', err);
						// fail回调会由core.js自动显示错误信息
					}
				});
			},
			getPhoneNumber(e) {
				var that = this;
				let version = uni.getSystemInfoSync().SDKVersion;

				if (e.detail.errMsg == "getPhoneNumber:ok") {
					if (that.compareVersion(version, '2.21.2') >= 0) {
						that.phoneNumber(that, {
							code: e.detail.code
						})
					} else {
						uni.login({
							provider: 'weixin',
							success: (auth) => {
								that.phoneNumber(that, {
									iv: e.detail.iv,
									encryptedData: e.detail.encryptedData
								})
							},
							fail: () => {
								uni.showToast({
									'title': '微信登录授权失败',
									icon: "none"
								});
							}
						})
					}
				} else {
					console.log("用户点击了拒绝")
				}
			},

			phoneNumber(that, data) {

				let wxAccount = that.$core.getCache('wx_account');
				data['third_id'] = wxAccount.third_id;
				let recom_pid = uni.getStorageSync('recom_pid') || '';
				let recom_group = uni.getStorageSync('recom_group') || '';
				if (recom_pid) {
					data['pid'] = recom_pid;
					data['first_group_id'] = recom_group;
				}
				// 如果没有推荐人分组，使用当前选择的身份
				if (!data['first_group_id']) {
					data['first_group_id'] = that.selectedGroupId;
				}
				data.avatar = that.avatar;
				data.nickname = that.nickname;
				
				that.$core.post({
					url: 'xilujob.user/wxNumberEncrypted',
					data: data,
					success: (ret, response) => {
						wxAccount['bindind'] = 1;
						let userinfo = ret.data.userinfo;
						that.$core.setCache('wx_account', wxAccount);
						getApp().globalData.userinfo = userinfo;
						that.$core.setUserinfo(userinfo);

						// 检查用户头像和昵称是否为空
						if (!userinfo.avatar || !userinfo.nickname) {
							// 跳转到用户信息验证页面
							uni.navigateTo({
								url: '/pages/company/mine_info'
							});
						} else {
							// 登录成功后统一使用reLaunch跳转到首页
							uni.reLaunch({
								url: '/pages/public/index'
							});
						}
						
						uni.$emit(app.globalData.Events.UserLogin, userinfo);
						uni.showToast({
							title: '登录成功',
						});
					},
					fail: (ret, response) => {
						//失败，重试
						uni.showToast({
							'title': "获取失败",
							icon: "none"
						})
						return false;
					}
				});

			},


			//版本比较
			compareVersion(v1, v2) {
				v1 = v1.split('.')
				v2 = v2.split('.')
				const len = Math.max(v1.length, v2.length)

				while (v1.length < len) {
					v1.push('0')
				}
				while (v2.length < len) {
					v2.push('0')
				}

				for (let i = 0; i < len; i++) {
					const num1 = parseInt(v1[i])
					const num2 = parseInt(v2[i])

					if (num1 > num2) {
						return 1
					} else if (num1 < num2) {
						return -1
					}
				}

				return 0
			}
		}
	}
</script>

<style>
	.head {
		margin-right: 26rpx;
		width: 128rpx;
		height: 128rpx;
		border: 4rpx solid var(--normal);
		border-radius: 50%;
	}

	.authorize_content {
		padding: 120rpx 75rpx;
		box-sizing: border-box;
	}

	.authorize_content .header {
		width: 201rpx;
		height: 201rpx;
		/* border: 6rpx solid #fff; */
		/* box-shadow: 0px 3rpx 8rpx 0px rgba(213, 213, 213, 0.4); */
		border-radius: 50%;
		overflow: hidden;
		margin: 0 auto;
		position: relative;
	}

	.authorize_content .header .tips {
		width: 201rpx;
		height: 201rpx;
		border-radius: 50%;
		color: #D8D8D8;
		background: rgba(0, 0, 0, 0.6);
		position: absolute;
		top: 0;
		left: 0;
		font-size: 36rpx;
		text-align: center;
	}

	.authorize_content .header image {
		width: 100%;
		height: 100%;
		display: block;
	}

	.authorize_content .title {
		font-size: 32rpx;
		color: #333333;
		padding-top: 50rpx;
		margin-top: 40rpx;
		/* border-top: 1rpx solid #EDEDED; */
		text-align: center;
	}

	.authorize_content .info {
		font-size: 28rpx;
		color: #999999;
		padding-top: 30rpx;
		padding-bottom: 70rpx;
		text-align: center;
	}

	.authorize_content button {
		width: 600rpx;
		margin-bottom: 40rpx;
	}

	.container {
		min-height: calc(100vh - env(safe-area-inset-top) - var(--window-bottom) - var(--window-top));
		overflow: hidden;
		font-size: 28rpx;
		box-sizing: border-box;
		position: relative;
	}

	.m-backdrop {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: auto;
		z-index: -1;
	}

	.btn1 {
		height: 80rpx;
		border-radius: 8rpx;
		text-align: center;
		background-color: var(--normal);
		color: #FFFFFF;
		font-size: 28rpx;
		line-height: 80rpx;
	}

	.btn2 {
		background-color: #D8D8D8;
		color: #FFFFFF;
		height: 80rpx;
		border-radius: 8rpx;
		text-align: center;
		font-size: 28rpx;
		line-height: 80rpx;
		border: none;
		box-shadow: none;
	}

	.user-rules {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		margin-top: 80rpx;
	}

	.primary-color {
		color: #0896e0;
	}

	.u-checkbox__label {
		color: #999999 !important;
	}

	.rules {
		margin-top: 20rpx;
	}

	.login-wrap {
		padding: 215rpx 30rpx 30rpx;
	}

	.login-wrap .title {
		margin: 0 0 125rpx 50rpx;
		font-size: 50rpx;
		font-weight: bold;
		color: #ffffff;
		line-height: 56rpx;
	}

	.login-box {
		padding: 90rpx 50rpx 50rpx;
		width: 690rpx;
		height: 645rpx;
		background: #ffffff;
		box-shadow: 0 6rpx 29rpx 1rpx rgba(45, 45, 45, 0.14);
		border-radius: 20rpx;
	}

	.input-box {
		padding: 0 50rpx;
		height: 80rpx;
		border: 1rpx solid #cdcdcd;
		border-radius: 40rpx;
	}

	.input-box+.input-box {
		margin-top: 50rpx;
	}

	.input-box image {
		display: block;
		width: 30rpx;
		height: 44rpx;
	}

	.login-box .btn-login {
		margin: 125rpx auto 40rpx;
		width: 590rpx;
		height: 92rpx;
		background: var(--primary);
		border-radius: 8rpx;
		font-size: 32rpx;
		font-weight: 500;
		color: #ffffff;
		line-height: 92rpx;
		text-align: center;
	}

	.foot-row image {
		margin: 0 20rpx 0 0;
		display: block;
		width: 38rpx;
		height: 38rpx;
		border-radius: 50%;
	}


	.popup-mask {
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		background: rgba(0, 0, 0, 0.5);
		z-index: 9999;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.agreePop {
		width: 640rpx;
		height: 60vh;
		max-height: 800rpx;
		background: #ffffff;
		border-radius: 20rpx;
		overflow: hidden;
		display: flex;
		flex-direction: column;
	}

	.popup-header {
		padding: 30rpx;
		border-bottom: 1rpx solid #f0f0f0;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.popup-title {
		font-size: 34rpx;
		font-weight: bold;
		color: #333;
	}

	.close-btn {
		width: 60rpx;
		height: 60rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 48rpx;
		color: #999;
	}

	.popup-content {
		flex: 1;
		overflow: hidden;
		position: relative;
	}

	.iframe-content {
		width: 100%;
		height: 100%;
		border: none;
	}

	.webview-content {
		width: 100%;
		height: 100%;
	}

	.text-content {
		width: 100%;
		height: 100%;
		box-sizing: border-box;
	}

	.content-text {
		padding: 60rpx 40rpx;
		text-align: center;
		font-size: 28rpx;
		color: #666;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		height: 100%;
	}

	.view-btn {
		margin-top: 40rpx;
		padding: 24rpx 60rpx;
		background: var(--primary);
		color: #fff;
		border-radius: 8rpx;
		font-size: 30rpx;
		width: auto;
		display: inline-block;
	}

	.foot-wrap {
		padding: 30rpx;
		border-top: 1rpx solid #f0f0f0;
		display: flex;
		justify-content: space-between;
		gap: 20rpx;
	}

	.btn-disagree {
		flex: 1;
		height: 80rpx;
		line-height: 80rpx;
		background: #f5f5f5;
		color: #666;
		text-align: center;
		border-radius: 8rpx;
		font-size: 32rpx;
		border: 1rpx solid #e0e0e0;
	}

	.btn-agree {
		flex: 1;
		height: 80rpx;
		line-height: 80rpx;
		background: var(--primary);
		color: #fff;
		text-align: center;
		border-radius: 8rpx;
		font-size: 32rpx;
		font-weight: bold;
	}

	/* 身份选择器样式 */
	.identity-selector {
		display: flex;
		justify-content: space-between;
		gap: 20rpx;
	}

	.identity-item {
		flex: 1;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		background: #FFFFFF;
		border: 2rpx solid #E5E5E5;
		border-radius: 12rpx;
		padding: 30rpx 20rpx;
		transition: all 0.3s;
	}

	.identity-item.active {
		border-color: var(--primary);
		background: rgba(255, 130, 56, 0.05);
	}

	.identity-icon {
		width: 80rpx;
		height: 80rpx;
		margin-bottom: 15rpx;
	}

	.identity-text {
		font-size: 32rpx;
		font-weight: bold;
		color: #333333;
		margin-bottom: 8rpx;
	}

	.identity-item.active .identity-text {
		color: var(--primary);
	}

	.identity-desc {
		font-size: 24rpx;
		color: #999999;
	}

	.identity-item.active .identity-desc {
		color: var(--primary);
	}
</style>